<template>
	<view class="setUp" :class="APPTheme">
		<uni-nav-bar fixed status-bar left-icon="back" title="设置" :color="APPTheme=='theme-light'?'#000000':'#ffffff'" :background-color="APPTheme=='theme-light'?'#ffffff':'#000000'" @clickLeft="$lizhao.lznavigate.lzNavigateBack()"></uni-nav-bar>
		<view class="lz-flex">
			<view class="u-m-r-10">
				<u-avatar v-if="receiveInfo.photo" :src="GLOBAL.image_svr+receiveInfo.photo" mode="square" size="140"></u-avatar>
				<view class="text-warp" v-else>{{computedUserInfo(receiveInfo)}}</view>
			</view>
			<view class="lz-flex-center">
				<view class="u-font-18 u-p-b-20">{{receiveInfo.name}}</view>
				<view class="lz-font-14 theme-tips-color">手机号:{{receiveInfo.phone}}</view>
			</view>
			<view class="u-m-l-10 u-p-10">
				<u-icon name="arrow-right" color="#969799" size="28"></u-icon>
			</view>
		</view>
		<u-cell-group class="theme-bg" :border="false">
			<u-cell-item title="聊天背景" hover-class="theme-bg-active" @click="cellItemClick(1)"></u-cell-item>
			<u-cell-item title="设置备注" hover-class="theme-bg-active" @click="cellItemClick(2)"></u-cell-item>
			<u-cell-item title="消息免打扰" hover-class="theme-bg-active" label="开启后,此用户将不再有声音提示" :arrow="false">
				<u-switch slot="right-icon" v-model="disturb.switchChecked"  :inactive-color="APPTheme=='theme-light'?'#fff':'#888'" @change="switchChange"></u-switch>
			</u-cell-item>
			<u-cell-item title="量子通信" hover-class="theme-bg-active" label="开启后,消息将通过量子加密传输给对方【对方需要量子解密后才能查看消息内容】" :arrow="false">
				<u-switch slot="right-icon" v-model="qss.switchChecked"  :inactive-color="APPTheme=='theme-light'?'#fff':'#888'" @change="qssSwitchChange"></u-switch>
			</u-cell-item>
		</u-cell-group>
		<u-cell-group class="theme-bg" :border="false">
			<u-cell-item hover-class="theme-bg-active" @click="deleMsgFn">
				<view slot="title" style="color: #007AFF;">删除聊天记录</view>
			</u-cell-item>
		</u-cell-group>
		<u-cell-group class="theme-bg" :border="false">
			<u-cell-item  hover-class="theme-bg-active" :arrow="false">
				<view slot="title" class="solt-cell-item">删除好友</view>
			</u-cell-item>
		</u-cell-group>
		<!-- 对话框 -->
		<uni-popup ref="dialogInput" type="dialog">
			<uni-popup-dialog mode="input" :value="dialog.value" :title="dialog.title" :placeholder="dialog.placeholder" @confirm="dialogInputConfirm"></uni-popup-dialog>
		</uni-popup>
	</view>
	
</template>

<script>
	let that
	import {
		mapGetters,
		mapActions
	} from 'vuex'
	import uniPopupDialog from '@/components/uni-popup/uni-popup-dialog.vue'
	export default {
		components:{
			uniPopupDialog,
		},
		computed: {
			...mapGetters(['APPTheme', 'userInfo', 'api']),
			computedUserInfo(){
				return (item)=>{
					let user=''
					if(item.name){
						user=item.name.slice(item.name.length-2,item.name.length);
					}
					return user
				}
			}
		},
		props: {
			show: {
				type: Boolean,
				default: false
			},
		},
		data() {
			return {
				pic:'',
				receiveId:'',
				receiveInfo:{},//接收者信息
				disturb:{//免打扰人消息
					switchChecked:false,//消息免打扰
					list:[]
				},
				qss:{
					switchChecked:false,//量子通信
					list:[]
				},
				dialog:{//弹出对话框
					title:'',
					placeholder:'',
					value:''
				},
				user:{
					sign:false,//当前用户是否设置过手势
				}
			}
		},
		onLoad(e) {
			that = this
			that.receiveId=e.receiveId
			//获取用户信息
			that.getReceiveInfoFn()
			//获取消息免打扰人列表
			that.getStorageSyncFn()
			
			uni.$on('page_mpvue-gesture-lock',(res)=>{
				if(res=="true"){//打开量子通信
					//量子通信
					that.qss.list.push(that.receiveId)
					//数组去重
					var list = that.qss.list.filter((x, index,self)=>self.indexOf(x)===index)
					// //存储免打扰人列表信息
					uni.setStorageSync('msg_qss_user_list',list);
				}else{//关闭免打扰
					var list = that.qss.list.filter(item=>{
						return item!=that.receiveId
					})
					console.log(list);
					// //存储免打扰人列表信息
					uni.setStorageSync('msg_qss_user_list',list);
				}
			})
		},
		onShow() {
			//获取量子传输人列表
			that.getQssStorageSyncFn()
			//获取手势密码
			that.getUserSign()
		},
		methods: {
			//获取手势
			getUserSign(){
				that.GLOBAL.doGet(that.api.GLOBAL_rest_sys_user_getUserSign,{}).then(res=>{
					if(res.code=='0'&&res.data){//设置过手势
						that.user.sign=true
					}
				})
			},
			//点击每一行
			cellItemClick(index){
				if(index==1){//背景商城
					uni.navigateTo({
						url: '/pages/IM/backgroundMall/backgroundMall?receiveId='+that.receiveId
					});
				}else if(index==2){//修改备注
					that.$refs.dialogInput.open()
					that.dialog={
						title:'设置备注',
						placeholder:'请输入备注',
						value:that.receiveInfo.name
					}
				}
			},
			//点击确认弹框
			dialogInputConfirm(fn,item){
				console.log(item);
				if(item.length==0){
					that.$refs.dialogInput.close()
					uni.showToast({
						title: '内容不能为空',
						icon:'none'
					});
					return
				}
				let req={
					userId:JSON.parse(that.userInfo).id,//当前用户id
					remarksId:that.receiveId,//修改用户id
					remarksName:item,// 备注名
				}
				that.GLOBAL.doGet(that.api.GLOBAL_rest_webSocket_chat_updateRemarks,req).then(res=>{
					if(res.code=='0'){
						uni.showToast({
							title: res.data,
							icon:'none'
						});
						that.$refs.dialogInput.close()
						uni.$emit('pages_IM_count',true)
						uni.$emit('pages_setUp_userInfo',true)
						//获取用户信息
						that.getReceiveInfoFn()
					}
				})
			},
			//获取用户信息
			getReceiveInfoFn(){
				that.GLOBAL.doGet(that.api.GLOBAL_rest_sys_user_findUserById,{id:that.receiveId}).then(res=>{
					console.log(res);
					if(res.code=='0'){
						that.receiveInfo=res.data
					}
				}).catch(err=>{
					console.log('获取用户信息失败');
				})
			},
			//删除聊天记录
			deleMsgFn(){
				uni.showModal({
					content: '确定后，将删除本地聊天记录',
					success: res => {
						if(res.confirm){
							let req={
								receiveId:that.receiveId
							}
							that.$lizhao.lzsqlite.deleteChatRecord(req).then(res=>{
								console.log('删除结果',res);
								if(res.code=='0'){
									uni.showToast({
										title: '删除成功',
										icon:'success'
									});
									uni.$emit('deleteChatRecord_lz_chat',true)
								}else{
									uni.showToast({
										title: '删除失败',
										icon:'none'
									});
								}
							})
						}
					},
					fail: () => {},
					complete: () => {}
				});
			},
			//设置消息免打扰
			switchChange(e){
				console.log(e);
				if(e){//打开免打扰
					//消息免打扰人
					that.disturb.list.push(that.receiveId)
					//数组去重
					var list = that.disturb.list.filter((x, index,self)=>self.indexOf(x)===index)
					// //存储免打扰人列表信息
					uni.setStorageSync('msg_disturb_user_list',list);
				}else{//关闭免打扰
					that.disturb.list.filter(item=>{
						return item!=that.receiveId
					})
					// //存储免打扰人列表信息
					uni.setStorageSync('msg_disturb_user_list',list);
				}
				
			},
			//量子通信
			qssSwitchChange(e){
				if(that.user.sign){
					console.log(e);
					uni.navigateTo({
						url: '/pages/IM/components/mpvue-gesture-lock/mpvue-gesture-lock?page=Im_setUp&Switch='+e,
						success: res => {},
						fail: () => {},
						complete: () => {}
					});
				}else{
					uni.showModal({
						title: '提示',
						content: '检测到用户未设置量子手势密码,是否前往设置',
						success: res => {
							console.log(res);
							if(res.confirm){
								uni.navigateTo({url: '/pages/index/setUp/setUp'});
							}else{
								//获取量子传输人列表
								that.getQssStorageSyncFn()
							}
							
						}
					});
				}
				
				// if(e){//打开量子通信
				// 	//量子通信
				// 	that.qss.list.push(that.receiveId)
				// 	//数组去重
				// 	var list = that.qss.list.filter((x, index,self)=>self.indexOf(x)===index)
				// 	// //存储免打扰人列表信息
				// 	uni.setStorageSync('msg_qss_user_list',list);
				// }else{//关闭免打扰
				// 	that.qss.list.filter(item=>{
				// 		return item!=that.receiveId
				// 	})
				// 	// //存储免打扰人列表信息
				// 	uni.setStorageSync('msg_qss_user_list',list);
				// }
			},
			//获取消息免打扰人列表
			getStorageSyncFn(){
				try{
					that.disturb.list=uni.getStorageSync('msg_disturb_user_list')||[]
				}catch(e){
					//TODO handle the exception
					that.disturb.list=[]
				}
				if(that.disturb.list.includes(that.receiveId)){
					that.disturb.switchChecked=true
				}else{
					that.disturb.switchChecked=false
				}
			},
			//获取量子传输人列表
			getQssStorageSyncFn(){
				try{
					that.qss.list=uni.getStorageSync('msg_qss_user_list')||[]
				}catch(e){
					//TODO handle the exception
					that.qss.list=[]
				}
				if(that.qss.list.includes(that.receiveId)){
					that.qss.switchChecked=true
				}else{
					that.qss.switchChecked=false
				}
			},
			
		}

	}
</script>

<style scoped lang="scss">
.setUp{
	height: 100%;
	.lz-flex{
		display: flex;padding: 15px;justify-content: space-between;align-items: center;width: 100%;box-sizing: border-box;
		.u-m-r-10{margin-right: 10px;}
		.lz-flex-center{
			flex: 1;overflow: hidden;
		}
		.text-warp{
			background: $bg-color;border-radius: 50%;width: 140rpx;height: 140rpx;font-size: 16px;display: flex;justify-content: center;align-items: center;color: #fff;
		}
	}
	.theme-bg{
		margin-bottom: 5px;
		.solt-cell-item{
			color: #c84751;text-align: center;width: 90vw;letter-spacing: 2px;
		}
	}
}
</style>
